// 标签页管理器模块

/**
 * 绑定标签页切换功能
 */
export function bindTabSwitching() {
    const tabNav = document.getElementById('tab-nav');
    if (!tabNav) return;
    
    const tabButtons = tabNav.querySelectorAll('[data-tab]');
    const tabContents = document.querySelectorAll('.tab-content');
    
    // 确保初始标签状态正确
    const firstTab = tabButtons[0];
    if (firstTab) {
        const firstTabId = firstTab.getAttribute('data-tab');
        const firstTabContent = document.getElementById(`${firstTabId}-tab`);
        if (firstTabContent) {
            firstTabContent.classList.remove('hidden');
            firstTabContent.classList.add('tab-content-active');
        }
    }
    
    tabButtons.forEach(button => {
        button.addEventListener('click', function() {
            // 移除所有标签的激活样式
            tabButtons.forEach(btn => {
                btn.classList.remove('border-primary', 'text-primary', 'font-medium');
                btn.classList.add('border-transparent', 'text-gray-500');
            });
            
            // 为当前标签添加激活样式
            this.classList.add('border-primary', 'text-primary', 'font-medium');
            this.classList.remove('border-transparent', 'text-gray-500');
            
            // 隐藏所有内容区域
            tabContents.forEach(content => {
                content.classList.add('hidden');
                content.classList.remove('tab-content-active');
            });
            
            // 显示当前标签对应的内容区域
            const targetTab = this.getAttribute('data-tab');
            const targetContent = document.getElementById(`${targetTab}-tab`);
            if (targetContent) {
                targetContent.classList.remove('hidden');
                targetContent.classList.add('tab-content-active');
            }
            
            // 记住选择的标签
            localStorage.setItem('userCenterActiveTab', targetTab);
        });
    });
    
    // 恢复上次选中的标签
    const savedTab = localStorage.getItem('userCenterActiveTab');
    if (savedTab) {
        const savedTabButton = tabNav.querySelector(`[data-tab="${savedTab}"]`);
        if (savedTabButton) {
            savedTabButton.click();
        }
    }
}